<!-- 条目修改界面 -->
<ul class="nav nav-tabs">
  <li class="active">
    <a href="#entry" data-toggle="tab">条目</a>
  </li>
  <li (click)="showRouteDetail()">
    <a href="#routeDetail" data-toggle="tab">在途明细</a>
  </li>
  <li (click)="showBatchMode()">
    <a href="#routeBatch" data-toggle="tab">在途批次</a>
  </li>
</ul>
<div class="tab-content">
  <div class="tab-pane in active box box-default" id="entry">
    <!-- 条目页面 -->
    <div class="box box-default">
      <div class="box-body">
        <section class="content">
          <div class="row">
            <div class="col-xs-12">
              <div class="nav-tabs-custom remove-border">
                <ul class="nav nav-tabs ul-change" style="border-bottom-width: 0px;margin-bottom:10px;">
                  <li *ngIf="_.includes(tabRight,'flfg')" id="flfg" [ngClass]="{'active':tabRight[0] == 'flfg'}" (click)="changeTab('flfg',0)">
                    <a href="#tab_1" data-toggle="tab">法律法规</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'gszd')" id="gszd" [ngClass]="{'active':tabRight[0] == 'gszd'}" (click)="changeTab('gszd',1)">
                    <a href="#tab_2" data-toggle="tab">公司制度</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htgm')" id="htgm" [ngClass]="{'active':tabRight[0] == 'htgm'}" (click)="changeTab('htgm',0)">
                    <a href="#tab_3" data-toggle="tab">合同/公募</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htydy')" id="htydy" [ngClass]="{'active':tabRight[0] == 'htydy'}" (click)="changeTab('htydy',0)">
                    <a href="#tab_4" data-toggle="tab">合同/一对一</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htydd')" id="htydd" [ngClass]="{'active':tabRight[0] == 'htydd'}" (click)="changeTab('htydd',0)">
                    <a href="#tab_5" data-toggle="tab">合同/一对多</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htnj')" id="htnj" [ngClass]="{'active':tabRight[0] == 'htnj'}" (click)="changeTab('htnj',0)">
                    <a href="#tab_6" data-toggle="tab">合同/年金</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htylj')" id="htylj" [ngClass]="{'active':tabRight[0] == 'htylj'}" (click)="changeTab('htylj',0)">
                    <a href="#tab_7" data-toggle="tab">合同/养老金</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htyljcp')" id="htyljcp" [ngClass]="{'active':tabRight[0] == 'htyljcp'}" (click)="changeTab('htyljcp',0)">
                    <a href="#tab_12" data-toggle="tab">合同/养老金产品</a>
                  </li>
                  <li *ngIf="_.includes(tabRight,'htsb')" id="htsb" [ngClass]="{'active':tabRight[0] == 'htsb'}" (click)="changeTab('htsb',0)">
                    <a href="#tab_8" data-toggle="tab">合同/社保</a>
                  </li>
                  <li id="all" (click)="changeTab('',0)">
                    <a href="#tab_11" data-toggle="tab">全部</a>
                  </li>
                </ul>
                <form class="form-inline" style="margin-bottom:8px !important;">
                  <div class="box box-default collapsed-box">
                    <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12 btn-margin" style="padding-left:0px;">
                      <button type="button" class="btn btn-primary" (click)="shownQDIIModifySearch()">
                        <i class="fa fa-save"></i>搜索</button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-entryModify')" type="button" class="btn btn-primary" (click)="showModal('5')">
                        <i class="fa fa-search"></i>条目修改
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-flowInfo')" type="button" class="btn btn-primary" (click)="showModal('1')">
                        <i class="fa fa-search"></i>查看流程信息
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-entryhistory')" type="button" class="btn btn-primary" (click)="showModal('2')">
                        <i class="fa fa-search"></i>查看条目历史
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-15daysChange')" type="button" class="btn btn-primary" (click)="showModal('3')">
                        <i class="fa fa-search"></i>最新15天变更
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-newestCompare')" type="button" class="btn btn-primary" (click)="showModal('4')">
                        <i class="fa fa-search"></i>最新对比数据
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-export')" type="button" class="btn btn-primary" (click)="exportExcel()">
                        <i class="fa fa-sign-out"></i>导出数据
                      </button>
                      <button *ngIf="_.includes(menuResourceSet,'btn-NQDII-tm-historyChange')" type="button" class="btn btn-primary" (click)="showModal('historyChange')">
                        <i class="fa fa-sign-out"></i>查询历史变更数据
                      </button>
                      <button class="btn btn-box-tool pull-right" data-widget="collapse">
                        <i class="fa fa-plus"></i>
                      </button>
                    </div>
                    <div class="box-body">
                      <div class="form-group" style="padding-left:5px !important;margin-bottom:8px !important;">
                        <label class="control-label">账户名称：</label>
                        <input type="text" class="form-control" maxlength="2000" placeholder="账户名称" [(ngModel)]="getBody.sAccountName" name="sAccountName">
                        <label class="control-label">条款出处：</label>
                        <select [(ngModel)]="sFileSourcelist" name="sFileSourcelist" id="NqdiiModifyFileSource" multiple></select>

                        <label class="control-label">适用基金类别：</label>
                        <select [(ngModel)]="sFundType" name="sFundType" id="NqdiiModifyFundType" multiple></select>

                        <button (click)="loadlist(1)" type="button" class="btn btn-primary" style="margin-left:10px;">
                          <i class="fa fa-search"></i>查询</button>
                      </div>
                      <div class="form-group" style="padding-left:5px !important;margin-bottom:8px !important;">
                        <div class="form-group">
                          <label class="control-label">文件名称：</label>
                          <input type="text" class="form-control" maxlength="100" placeholder="文件名称" [(ngModel)]="getBody.sFileName" name="sFileName">
                          <label class="control-label">是否有效：</label>
                          <select class="form-control" style="min-width:183px;" name="sValid" [(ngModel)]="getBody.sValid">
                            <option [value]="''">全部</option>
                            <option [value]="1" selected="selected">有效</option>
                            <option [value]="0">无效</option>
                          </select>
                          <label class="control-label">风控条目编号：</label>
                          <input type="text" class="form-control" placeholder="风控条目编号" maxlength="9" [(ngModel)]="getBody.nNdId" (ngModelChange)="integerControl()"
                            name="nNdId">
                        </div>

                      </div>
                      <div class="form-group" style="padding-left:5px !important;">
                        <label class="control-label" style="padding-left:28px">内容：</label>
                        <input type="text" class="form-control" maxlength="2000" placeholder="内容" [(ngModel)]="getBody.f1" name="f1">
                        <label class="control-label" style="padding-left:15px">时间点：</label>
                        <div class="input-group date form_datetime" style="max-width:183px !important;">
                          <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                          </span>
                          <input [(ngModel)]="getBody.dOprDateCondition" name="dOprDateCondition" class="form-control" type="text" mwlFlatpickr style="background: white; cursor: pointer;">
                        </div>
                        <label class="control-label" style="padding-left:15px">适用基金组：</label>
                        <select [(ngModel)]="sFundGroupds" name="sFundGroupds" id="NqdiiModifyFundGroupds" multiple></select>
                      </div>
                    </div>
                  </div>
                </form>
                <div class="tab-content" style="padding:0px !important">

                  <div class="ibt-fixed-table-container">
                    <div class="table-scroll-content">
                      <div #modityTablePage></div>
                      <!-- <table class="table table-bordered table-hover table-striped table-keep-line" style="margin-top:unset !important;">
                        <thead>
                          <tr role="row">
                            <th>
                              <div class="cell" style="width:50px !important">
                                <div class="checkbox checkbox-primary">
                                  <input type="checkbox" id="isCheckedAll" [(ngModel)]="isCheckedAll" name="isCheckedAll" (ngModelChange)="checkedAll()">
                                  <label>
                                  </label>
                                </div>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('nNdId')">编号
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sFileName')">文件名称
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('f1')">内容
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sItemTypeZh')">属性
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sFileSourceZh')">条款出处
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sFundTypeZh')">适用基金类别
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sFundGroupdsZh')">适用基金组
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>

                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('f2')">指标释义
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('f3')">条目规定阀值
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkGreen" (click)="orderData('f4Zh')">事中控制方法
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkGreen" (click)="orderData('f5')">事中系统控制阀值
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkGreen" (click)="orderData('f6')">是否事中系统可控
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkGreen" (click)="orderData('f7')">系统风控编号
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkGreen" (click)="orderData('f8')">事中系统备注
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f9')">事后监控方法
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f10')">监控编号
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f11')">控制说明
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f12')">补偿控制
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f13')">风险等级
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f14')">监察部备注1
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkRed" (click)="orderData('f15')">监察部备注2
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkYellow" (click)="orderData('f16')">场外系统阀值(新股,定增,转债)
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkYellow" (click)="orderData('f17')">场外系统阀值(公增)
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkYellow" (click)="orderData('f18')">是否场外系统可控
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkYellow" (click)="orderData('f19')">场外风控编号
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkYellow" (click)="orderData('f20')">场外系统备注
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('sCreator')">录入人
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('sLaunchDate')">录入时间
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('sCheckPerson')">条目复核
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('sCheck')">复核时间
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>


                          </tr>
                        </thead>
                        <tbody>
                          <tr *ngFor="let item of listData">
                            <td>
                              <div class="cell" style="width:50px !important">
                                <div class="checkbox checkbox-primary">
                                  <input type="checkbox" name="checkbox1" [(ngModel)]="item.isChecked" (ngModelChange)="ctrlCheckAll()">
                                  <label>
                                  </label>
                                </div>
                              </div>
                            </td>
                            <td class="short_name" [attr.title]="item.nNdId">
                              <div class="cell" [ngClass]="{'dataChange':item.sState =='在途'}">{{item.nNdId}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sFileName">
                              <div class="cell">{{item.sFileName}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f1">
                              <div class="cell">{{item.f1}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sItemTypeZh">
                              <div class="cell">{{item.sItemTypeZh}}</div>

                            </td>
                            <td class="short_name" [attr.title]="item.sFileSourceZh">
                              <div class="cell">{{item.sFileSourceZh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sFundTypeZh">
                              <div class="cell">{{item.sFundTypeZh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sFundGroupdsZh">
                              <div class="cell">{{item.sFundGroupdsZh}}</div>
                            </td>

                            <td class="short_name" [attr.title]="item.f2">
                              <div class="cell">{{item.f2}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f3">
                              <div class="cell">{{item.f3}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f4Zh">
                              <div class="cell">{{item.f4Zh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f5">
                              <div class="cell">{{item.f5}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f6Zh">
                              <div class="cell">{{item.f6Zh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f7">
                              <div class="cell">{{item.f7}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f8">
                              <div class="cell">{{item.f8}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f9Zh">
                              <div class="cell">{{item.f9Zh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f10">
                              <div class="cell">{{item.f10}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f11">
                              <div class="cell">{{item.f11}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f12">
                              <div class="cell">{{item.f12}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f13Zh">
                              <div class="cell">{{item.f13Zh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f14">
                              <div class="cell">{{item.f14}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f15">
                              <div class="cell">{{item.f15}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f16">
                              <div class="cell">{{item.f16}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f17">
                              <div class="cell">{{item.f17}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f18Zh">
                              <div class="cell">{{item.f18Zh}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f19">
                              <div class="cell">{{item.f19}}</div>

                            </td>
                            <td class="short_name" [attr.title]="item.f20">
                              <div class="cell">{{item.f20}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sCreator">
                              <div class="cell">{{item.sCreator}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sLaunchDate">
                              <div class="cell">{{item.sLaunchDate}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sCheckPerson">
                              <div class="cell">{{item.sCheckPerson}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.sCheck">
                              <div class="cell">{{item.sCheck}}</div>
                            </td>
                          </tr>
                        </tbody>

                      </table> -->
                    </div>
                    <div class="ibt-table-fixed-content">
                      <table class="table table-bordered table-hover table-striped table-keep-line">
                        <thead>
                          <tr role="row">
                            <th>
                              <div class="cell" style="width:50px !important">
                                <div class="checkbox checkbox-primary">
                                  <input type="checkbox" id="isCheckedAll" [(ngModel)]="isCheckedAll" name="isCheckedAll" (ngModelChange)="checkedAll()">
                                  <label>
                                  </label>
                                </div>
                              </div>
                            </th>
                            <th>
                              <div class="cell" (click)="orderData('nNdId')">编号
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <!-- <th>
                              <div class="cell" (click)="orderData('sLatestChange')">最近变更时间
                                <i class="fa fa-sort"></i>
                              </div>
                            </th> -->
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('sFileName')">文件名称
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                            <th>
                              <div class="cell risk-MarkBlue" (click)="orderData('f1')">内容
                                <i class="fa fa-sort"></i>
                              </div>
                            </th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr *ngFor="let item of listData">
                            <td>
                              <div class="cell" style="width:50px !important">
                                <div class="checkbox checkbox-primary">
                                  <input type="checkbox" name="checkbox1" [(ngModel)]="item.isChecked" (ngModelChange)="ctrlCheckAll()">
                                  <label>
                                  </label>
                                </div>
                              </div>
                            </td>
                            <td class="short_name">
                              <div class="cell" [ngClass]="{'dataChange':item.sState =='在途'}">{{item.nNdId}}</div>
                            </td>
                            <!-- <td class="short_name">
                              <div class="cell">{{item.sLatestChange}}</div>
                            </td> -->
                            <td class="short_name">
                              <div class="cell">{{item.sFileName}}</div>
                            </td>
                            <td class="short_name" [attr.title]="item.f1">
                              <div class="cell">{{item.f1}}</div>
                            </td>
                          </tr>
                        </tbody>

                      </table>
                    </div>
                  </div>
                  <div class="box-footer clearfix" style="width:100%;">
                    <app-pagination [currentPageNum]="listPageInfo.currentPageNum" [pagesShow]="" [totalPages]="listPageInfo.totalPages" (pageChanged)="pageNavigation($event)">
                      <div class="pull-left pagination-detail" data-pagination-additional="true">
                        <span class="pagination-info">
                          当前显示第{{listPageInfo.startRow}}到第{{listPageInfo.endRow}}条，总共{{listPageInfo.total}}条，
                        </span>
                        <span class="page-list">
                          每页记录
                          <span class="btn-group dropup">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                              <span class="page-size">{{listPageInfo.pageSize}}</span>
                              <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu" role="menu">
                              <li *ngFor="let i of listPageInfo.pageList" role="menuitem" [class.active]="listPageInfo.pageSize === i" (click)="sizeChange(i)">
                                <a>{{i}}</a>
                              </li>
                            </ul>
                          </span>
                          条
                        </span>
                      </div>
                    </app-pagination>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </section>
      </div>
    </div>
    <!-- end条目页面 -->
  </div>
  <div class="tab-pane box box-default" id="routeDetail">
    <div #routeDetail></div>
  </div>
  <div class="tab-pane box box-default" id="routeBatch">
    <div #routeBatch></div>
  </div>
</div>



<!-- 查看流程信息modal -->
<div class="modal modal-detail" id="modal1">
  <div #modifyFlowInfo></div>
</div>

<!-- 查看条目历史modal -->
<div class="modal modal-detail" id="modal2">
  <div #entryHistory></div>
</div>

<!-- 查看最近15天变更数据modal -->
<div class="modal modal-detail" id="modal3">
  <div #newChangeInfo></div>
</div>

<!-- 查看最新对比数据modal -->
<div class="modal modal-detail" id="modal4">
  <div #contrastInfo></div>
</div>

<!-- 条目修改modal -->
<div class="modal modal-detail" id="modal5">
  <div #entryChange></div>
</div>

<!-- 查询历史变更记录modal -->
<div class="modal modal-detail" id="historyChange">
  <div #historyChange></div>
</div>

<!-- 阅读维护须知正文modal -->
<div class="modal modal-detail" id="readNote">
  <div #readNote></div>
</div>

<!-- 搜索modal -->
<div class="modal modal-detail" id="nQDIIModifySearch">
  <div #nQDIIModifySearch></div>
</div>